<template>
	<view class="personDetailWp">
		<person-card :userInfo='friendInfo' :isFavorite='isFavorite' @handleMore='handleMore'
			@changIsFavorite='changIsFavorite' @goToFriendCard='goToFriendCard'></person-card>
		<u-popup :show="showMoreListPopup" :round="10" @close='hiddenMoreListPopup' mode="bottom"
			:closeOnClickOverlay='true' closeable>
			<view class="moreItem">
				<view class="left">
					<image :showLoading="true" :src="friendInfo.head" class="leftImg"></image>
				</view>
				<view class="right">
					<view>
						<text class="name"> {{friendInfo.name}}</text> <text class="title">
							{{friendInfo.position}}</text>
					</view>
					<view class="company">
						{{friendInfo.company}}
					</view>
				</view>
			</view>
			<!-- 操作栏 -->
			<view class="operateList">
				<view class="operateItem" v-for="(item, i) in operateList" :key="i" @click="handleOperateItem(item,i)">
					<view class="imgWp">
						<img :src="item.imgUrl" alt="">
					</view>
					<view class="text">
						{{item.text}}
					</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex'
	import baseConfig from '@/config/baseUrl.js'
	import personCard from '@/components/personCard/personCard.vue'
	export default {
		components: {
			personCard
		},
		data() {
			return {
				isFavorite: 0,
				friendInfo: {},
				showMoreListPopup: false,
				operateList: [{
						imgUrl: 'https://file.casugn.com/storecompcard/temp/存通讯录@2x_1656472891228.png',
						text: '储存到通讯录'
					},
					{
						imgUrl: 'https://file.casugn.com/storecompcard/temp/邮箱@2x_1656472910550.png',
						text: '复制邮箱号码'
					},
					{
						imgUrl: 'https://file.casugn.com/storecompcard/temp/位置 (2) 拷贝@2x_1656472904469.png',
						text: '去拜访'
					},
					{
						imgUrl: 'https://file.casugn.com/storecompcard//utcyog5DgWFF862bd6dae69e172e51889ff07ebd333f_1658220294290.png',
						text: '共同人脉'
					},
					{
						imgUrl: 'https://file.casugn.com/storecompcard/temp/删除@2x_1656472895045.png',
						text: '删除名片'
					},
				],
				showOperateListPopup: false,

			};
		},
		computed: {
			...mapState(['userInfo'])
		},
		//分享设置
		onShareAppMessage(res) {

			if (res.from === 'button') { // 来自页面内分享按钮
				console.log('来自页面内分享按钮', this.friendInfo);
				if (!this.userInfo.id) {
					return uni.showToast({
						title: '请先创建名片',
						icon: 'none'
					});

				} else {
					return {
						title: `${this.friendInfo.name?this.friendInfo.name:''}拜帖`,
						path: '/pagesCard/friendMainPage/friendMainPage?cardId=' + this.friendInfo.friendId
					}
				}

			} else {
				if (!this.userInfo.id) {
					return uni.showToast({
						title: '请先创建名片',
						icon: 'none'
					});

				} else {
					return {
						title: `${this.friendInfo.name?this.friendInfo.name:''}拜帖`,
						path: '/pagesCard/friendMainPage/friendMainPage?cardId=' + this.friendInfo.friendId
					}
				}

			}

		},

		// 页面onLoad接受参数/ 查询接口获取friendInfo
		onLoad(option) {
			const item = JSON.parse(decodeURIComponent(option.item))
			this.friendInfo = item
			console.log(this.friendInfo, '页面onLoad接受参数');
			this.isFavorite = this.friendInfo.status //收藏状态
		},
		methods: {
			//跳转好友card主页 页面
			goToFriendCard({
				friendId,
				friendOpenId,
				friendUnionId
			}) {
				if (!friendUnionId) {
					return uni.showToast({
						title: '未获取到friendUnionId',
						icon: 'none'
					});
				}
				if (friendId) {
					uni.navigateTo({
						url: `/pagesCard/friendMainPage/friendMainPage?cardId=${friendId}&openId=${friendOpenId}&unionId=${friendUnionId}`
					})
				} else {
					console.error('没有friend的cardId');
				}
			},
			handleMore() {
				this.showMoreListPopup = true
			},
			hiddenMoreListPopup() {
				this.showMoreListPopup = false
			},
			//收藏操作
			async changIsFavorite(data) {
				this.isFavorite = data
				let res = await this.$api.updateCollect(this.friendInfo.id, this.isFavorite)
				if (res.success) {
					//更新好友状态
					uni.showToast({
						title: res.message,
						icon: 'none'
					});
				}
			},
			//个人名片操作
			handleOperateItem(item, i) {
				//	console.log(this.friendInfo);
				this.hiddenMoreListPopup()
				switch (i) {
					//存储到通讯录
					case 0:
						let that = this

						// 读取 小程序已经授权的权限
						uni.getSetting({
							success(res) {
								// 判断是否拥有此权限进行拉起授权  和 重新授权功能
								if (!res.authSetting['scope.addPhoneContact']) {
									// 未授权此项权限 拉起授界面
									uni.authorize({
										scope: 'scope.addPhoneContact',
										success() {
											// 授权成功后 就可以执行 需要权限的  操作函数了
											uni.addPhoneContact({
												nickName: that.friendInfo.name,
												firstName: that.friendInfo.name,
												remark: '备注',
												mobilePhoneNumber: that.friendInfo.mobile,
												weChatNumber: that.friendInfo.wechat,
												organization: that.friendInfo.company, //公司
												title: that.friendInfo.position, //职位
												workPhoneNumber: that.friendInfo
													.workPhoneNumber ? that.friendInfo
													.workPhoneNumber : '', //工作电话
												email: that.friendInfo.mail ? that
													.friendInfo.mail : '',
												url: that.friendInfo.url ? that.friendInfo
													.url : '',
												addressCountry: that.friendInfo
													.addressCountry ? that.friendInfo
													.addressCountry : '', //国家
												addressState: that.friendInfo
													.addressState ? that.friendInfo
													.addressState : '', //省份
												addressCity: that.friendInfo.addressCity ?
													that.friendInfo.addressCity : '', //城市
												addressStreet: that.friendInfo
													.addressStreet ? that.friendInfo
													.addressStreet : '', //街道
												addressPostalCode: that.friendInfo
													.addressPostalCode ? that.friendInfo
													.addressPostalCode : '', //邮政编码
												success: function() {
													console.log('success');
												},
												fail: function() {
													console.log('fail');
													uni.showToast({
														title: '请授权以保存到通讯录',
														icon: 'none'
													});

												},
												cancel: function() {
													uni.showToast({
														title: '已取消',
														icon: 'none'
													});
												}
											});

										},
										fail(err) {
											/*
											 第一次拒绝授权后必须在 uni.authorize的fail中使用
											 uni.openSetting 才能进入设置界面打开授权按钮
											 */
											uni.showToast({
												title: '拒绝授权',
												icon: 'none'
											});
											// 这里必须经过一个confirm 不然也会出现问题（啥问题我也不知道）
											uni.showModal({
												title: '是否重新授权',
												success(res) {
													if (res.confirm) {
														uni.openSetting({
															success() {
																console.log(
																	'开启权限成功');
															},
															fail() {
																console.log(
																	'开启权限失败');
															}
														});
													} else if (res.cancel) {
														console.log('拒绝开启开启权限');
													}
												}
											});
										}
									});
								} else {
									uni.addPhoneContact({
										nickName: that.friendInfo.name,
										firstName: that.friendInfo.name,
										remark: '备注',
										mobilePhoneNumber: that.friendInfo.mobile,
										weChatNumber: that.friendInfo.wechat,
										organization: that.friendInfo.company, //公司
										title: that.friendInfo.position, //职位
										workPhoneNumber: that.friendInfo.workPhoneNumber ? that
											.friendInfo.workPhoneNumber : '', //工作电话
										email: that.friendInfo.mail ? that.friendInfo.mail : '',
										url: that.friendInfo.url ? that.friendInfo.url : '',
										addressCountry: that.friendInfo.addressCountry ? that
											.friendInfo.addressCountry : '', //国家
										addressState: that.friendInfo.addressState ? that
											.friendInfo.addressState : '', //省份
										addressCity: that.friendInfo.addressCity ? that.friendInfo
											.addressCity : '', //城市
										addressStreet: that.friendInfo.addressStreet ? that
											.friendInfo.addressStreet : '', //街道
										addressPostalCode: that.friendInfo.addressPostalCode ? that
											.friendInfo
											.addressPostalCode : '', //邮政编码
										success: function() {
											console.log('success');
										},
										cancel: function() {
											uni.showToast({
												title: '已取消',
												icon: 'none'
											});
										}
									});
								}
							}
						});

						break;
						//复制邮箱号码
					case 1:
						uni.setClipboardData({
							data: this.friendInfo.mail,
							success: function() {
								console.log('已复制邮箱号码');
							}
						});
						break;
						//添加微信号	

						//地图导航
					case 2:
						console.log('地图导航')
						let plugin = requirePlugin('routePlan');
						const key = baseConfig.mapData.mapKey; //使用在腾讯位置服务申请的key
						const referer = baseConfig.mapData.appName //调用插件的app的名称
						//模拟数据
						console.log(this.friendInfo.coord)
						let endPoint = this.friendInfo.coord
						if (endPoint.length < 1 || this.friendInfo.coord == null) {
							return uni.showToast({
								title: '用户未设置坐标信息',
								icon: 'none'
							});
						}
						wx.navigateTo({
							url: 'plugin://routePlan/index?key=' + key + '&referer=' + referer + '&endPoint=' +
								endPoint
						});

						break;
					case 3:
						//共同人脉
						console.log(this.friendInfo, '共同人脉')
						uni.navigateTo({
							url: `/pagesCard/commonFriend/commonFriend?friendOpenId=${this.friendInfo.friendOpenId}`
						})
						break;
					case 4:
						uni.showModal({
							title: '提示',
							content: '是否确认删除好友名片?',
							success: async (res) => {
								if (res.confirm) {
									let res = await this.$api.delBcCardBuddy(this.friendInfo.id)
									console.log(res);
									if (res.success) {
										uni.showToast({
											title: '删除成功!',
											icon: 'none'
										});
										uni.navigateBack()
									}
								} else if (res.cancel) {
									console.log('用户点击取消');
								}
							}
						});

						break;
					default:
						break;
				}
			},
		}
	}
</script>

<style lang="scss">
	.personDetailWp {
		margin: 0 30upx;
		padding-top: 40upx;
	}


	.moreItem {
		display: flex;
		margin: 30upx;
		padding: 15upx 0;
		border-bottom: 1upx solid #eee;

		.left {
			padding-right: 30upx;

			.leftImg {
				width: 100upx;
				height: 100upx;
			}
		}

		.right {
			.name {
				width: 91upx;
				height: 29px;
				font-size: 30upx;
				font-weight: 500;
				color: #000000;
				line-height: 36upx;
			}

			.title {
				padding-left: 22upx;
				font-size: 18upx;
				font-weight: 400;
				color: #666666;
				line-height: 36upx;
			}

			.company {
				padding-top: 22upx;
				font-size: 24upx;
				font-weight: 400;
				color: #333333;
				line-height: 36upx;
			}
		}
	}

	.operateList {
		margin-left: 60upx;
		margin-bottom: 60upx;

		.operateItem {
			display: flex;
			padding: 25upx 0;

			.imgWp {
				margin-right: 30upx;
				width: 37upx;
				height: 37upx;

				img {
					width: 37upx;
					height: 37upx;
				}
			}

			.text {

				font-size: 30upx;
				font-weight: 400;
				color: #333333;
				line-height: 36upx;
			}
		}
	}
</style>
